<template>
  <el-row :gutter="20" class="tools">
    <template v-if="toolsType === 1">
      <template v-if="searchType === 5">
        <el-col :span="16">
          <el-input v-model="input_goodscategory.name" :placeholder="inputValue" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_goodscategory)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 6">
        <el-col :span="16">
          <el-input v-model="input_coupon.name" placeholder="请输入名称" @change=""></el-input>
          <el-input v-model="input_coupon.expireDay" placeholder="请输入有效期" @change=""></el-input>
          <el-select v-model="input_coupon.status" placeholder="请选择状态">
            <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_coupon)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 7">
        <el-col :span="16">
          <el-cascader v-model="input_groupBuyGoods.gid" :options="gidOptions" @change="GidTypeSelect" :show-all-levels="false" :props="{}"
            style="" />
          <el-select v-model="input_groupBuyGoods.skuId" placeholder="请选择Sku">
            <el-option v-for="item in skuIdOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_groupBuyGoods)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 8">
        <el-col :span="16">
          <el-input v-model="input_adlist.title" placeholder="请输入广告名称" @change=""></el-input>
          <el-input v-model="input_adlist.code" placeholder="请输入广告位" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_adlist)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <el-col :span="8" style="text-align:right">
        <el-button type="primary" icon="el-icon-star-off" @click="$emit('add')" class="tab_input" style="width:90px;margin-right: 20px;">新增</el-button>
      </el-col>
    </template>
    <template v-if="toolsType === 3">
      <el-col :span="24" style="text-align:right">
        <el-button type="primary" icon="el-icon-star-off" @click="$emit('add')" class="tab_input" style="width:90px;margin-right: 20px;">新增</el-button>
      </el-col>
    </template>
    <template v-if="toolsType === 2">
      <template v-if="searchType === 1">
        <el-col :span="24">
          <el-input v-model="input_userinfo.nick" placeholder="请输入昵称" @change=""></el-input>
          <el-input v-model="input_userinfo.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_userinfo)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 2">
        <el-col :span="24">
          <el-input v-model="input_useraddress.name" placeholder="请输入收货人姓名" @change=""></el-input>
          <el-input v-model="input_useraddress.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_useraddress)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 3">
        <el-col :span="24">
          <el-input v-model="input_dateandphone.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-date-picker v-model="input_dateandphone.date" type="datetimerange" align="right" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" :start-placeholder="dateStart"
            :end-placeholder="dateEnd" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_dateandphone)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 4">
        <el-col :span="24">
          <el-input v-model="input_userbankcard.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_userbankcard)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 5">
        <el-col :span="24">
          <el-input v-model="input_name.name" :placeholder="inputValue" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_name)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 6">
        <el-col :span="24">
          <el-input v-model="input_couponRecords.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-select v-model="input_couponRecords.status" placeholder="请选择状态">
            <el-option v-for="item in couponRecordsOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_couponRecords)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 7">
        <el-col :span="24">
          <el-input v-model="input_orderGoodsInfo.orderId" placeholder="请输入订单号" @change=""></el-input>
          <el-input v-model="input_orderGoodsInfo.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-select v-model="input_orderGoodsInfo.status" placeholder="请选择状态">
            <el-option v-for="item in orderGoodsInfoOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-date-picker v-model="input_orderGoodsInfo.date" type="datetimerange" align="right" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" :start-placeholder="dateStart"
            :end-placeholder="dateEnd" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_orderGoodsInfo)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 8">
        <el-col :span="24">
          <el-input v-model="input_orderWithdraw.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-select v-model="input_orderWithdraw.status" placeholder="请选择状态">
            <el-option v-for="item in orderWithdrawOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-date-picker v-model="input_orderWithdraw.date" type="datetimerange" align="right" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" :start-placeholder="dateStart"
            :end-placeholder="dateEnd" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_orderWithdraw)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 9">
        <el-col :span="24">
          <el-input v-model="input_relationship.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-select v-model="input_relationship.type" placeholder="请选择类型">
            <el-option v-for="item in relationshipOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_relationship)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 10">
        <el-col :span="24">
          <el-input v-model="input_authenticationRecords.phone" placeholder="请输入手机号" @change=""></el-input>
          <el-input v-model="input_authenticationRecords.name" placeholder="请输入姓名" @change=""></el-input>
          <el-select v-model="input_authenticationRecords.status" placeholder="请选择状态">
            <el-option v-for="item in authenticationRecordsOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_authenticationRecords)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 11">
        <el-col :span="24">
          <el-input v-model="input_msgNotification.title" placeholder="请输入消息标题" @change=""></el-input>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_msgNotification)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 12">
        <el-col :span="24">
          <el-date-picker v-model="input_statsInfo.date" type="datetimerange" align="right" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" :start-placeholder="dateStart"
            :end-placeholder="dateEnd" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_statsInfo)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
       <template v-if="searchType === 13">
        <el-col :span="16">
          <el-cascader v-model="input_groupBuyGoods.gid" :options="gidOptions" @change="GidTypeSelect" :show-all-levels="false" :props="{}"
            style="" />
          <el-select v-model="input_groupBuyGoods.skuId" placeholder="请选择Sku">
            <el-option v-for="item in skuIdOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-select v-model="input_groupBuyGoods.status" placeholder="请选择状态">
            <el-option v-for="item in groupBuyGoodsStatusOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_groupBuyGoods)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
      <template v-if="searchType === 14">
        <el-col :span="24">
          <el-input v-model="input_goodsComment.name" :placeholder="inputValue" @change=""></el-input>
                  <el-select v-model="input_goodsComment.status" placeholder="请选择状态">
            <el-option v-for="item in goodsCommentStatusOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="$emit('search',input_goodsComment)" style="margin-left:20px;">查询</el-button>
        </el-col>
      </template>
    </template>
  </el-row>
</template>

<script>
  export default {
    props: ["toolsType", "searchType", "inputValue", "defaultTime", "statusOptions", "gidOptions", "skuIdOptions"],
    data() {
      return {
        dateStart: '',
        dateEnd: '',
        input_userinfo: {
          nick: '',
          phone: ''
        },
        input_useraddress: {
          name: '',
          phone: ''
        },
        input_dateandphone: {
          date: [],
          phone: ''
        },
        input_userbankcard: {
          phone: ''
        },
        input_goodscategory: {
          name: ''
        },
        input_name: {
          name: ''
        },
        input_coupon: {
          name: '',
          status: '',
          expireDay: '',
        },
        input_couponRecords: {
          phone: '',
          status: ''
        },
        input_orderGoodsInfo: {
          orderId: '',
          date: [],
          phone: '',
          status:'',
        },
        input_orderWithdraw: {
          status: '',
          date: [],
          phone: ''
        },
        input_statsInfo:{
          date: [],
        },
        input_groupBuyGoods: {
          gid:'',
          skuId:'',
          status:''
        },
        input_adlist: {
          title: '',
          code: ''
        },
        input_relationship:{
          phone: '',
          type: ''
        },
        input_authenticationRecords:{
          phone: '',
          name: '',
          status:''
        },
        input_msgNotification:{
          title:''
        },
        input_goodsComment:{
          name:'',
          status:''
        },
        couponRecordsOptions: [{
          label: "未使用",
          value: 0
        }, {
          label: "已使用",
          value: 1
        }, {
          label: "已过期",
          value: 2
        }],
        orderGoodsInfoOptions:[{
          label: "生成订单，待付款",
          value: 1
        }, {
          label: "已支付，待发货",
          value: 2
        }, {
          label: "已发货，待收货",
          value: 3
        }, {
          label: "已收货，待评价",
          value: 4
        }, {
          label: "已评价，已完成",
          value: 5
        }, {
          label: "退款售后",
          value: 6
        }, {
          label: "已取消",
          value: 7
        }, {
          label: "已删除",
          value: 8
        }],
        orderWithdrawOptions: [{
          label: "待审核",
          value: 1
        }, {
          label: "已付款",
          value: 2
        }, {
          label: "已完成",
          value: 5
        }, {
          label: "未审核通过",
          value: 6
        }, {
          label: "已取消",
          value: 7
        }, {
          label: "已删除",
          value: 8
        }],
        relationshipOptions: [{
          label: "上级",
          value: 1
        }, {
          label: "上上级",
          value: 2
        }, {
          label: "一级团队",
          value: 3
        }, {
          label: "二级团队",
          value: 4
        }],
        authenticationRecordsOptions:[
          {
          label: "待审核",
          value: 0
        },{
          label: "审核通过",
          value: 1
        }, {
          label: "审核不通过",
          value: 2
        }],
        groupBuyGoodsStatusOptions:[
           {
          label: "发起团购",
          value: 0
        },{
          label: "团购成功",
          value: 1
        }, {
          label: "团购失败",
          value: 2
        }
        ],
        goodsCommentStatusOptions:[
          {
          label: "审核中",
          value: 0
          },{
          label: "审核通过",
          value: 1
          }, {
          label: "审核不通过",
          value: 2
          }, {
          label: "已删除",
          value: 3
          }
        ],
        pickerOptions: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
      };
    },
    methods: {
      timeVersion() {
        var week = [
          "星期日",
          "星期一",
          "星期二",
          "星期三",
          "星期四",
          "星期五",
          "星期六"
        ];
        var today = new Date(); //定义日期对象
        var yyyy = today.getFullYear(); //通过日期对象的getFullYear()方法返回年
        var MM = today.getMonth() + 1; //通过日期对象的getMonth()方法返回年
        var MM2 = today.getMonth(); //通过日期对象的getMonth()方法返回年
        var dd = today.getDate(); //通过日期对象的getDate()方法返回年
        var hh = today.getHours(); //通过日期对象的getHours方法返回小时
        var mm = today.getMinutes(); //通过日期对象的getMinutes方法返回分钟
        var ss = today.getSeconds(); //通过日期对象的getSeconds方法返回秒
        MM = this.checkTime(MM);
        MM2 = this.checkTime(MM2);
        dd = this.checkTime(dd);
        hh = this.checkTime(hh);
        mm = this.checkTime(mm);
        ss = this.checkTime(ss);
        var day = week[today.getDay()];
        this.dateEnd = yyyy + "-" + MM + "-" + dd +" " + hh + ":" + mm + ":" + ss;
        this.dateStart = yyyy + "-" + MM2 + "-" + dd +" " + hh + ":" + mm + ":" + ss;
        this.input_dateandphone.date[0] = this.dateStart;
        this.input_dateandphone.date[1] = this.dateEnd;
        this.input_orderGoodsInfo.date[0] = this.dateStart;
        this.input_orderGoodsInfo.date[1] = this.dateEnd;
        this.input_orderWithdraw.date[0] = this.dateStart;
        this.input_orderWithdraw.date[1] = this.dateEnd;
        if (this.defaultTime) {
          this.defaultTime.startTime = this.dateStart;
          this.defaultTime.endTime = this.dateEnd;
        }
        this.time = hh + ":" + mm + ":" + ss;
      },
      checkTime(i) {
        if (i < 10) {
          i = "0" + i;
        }
        return i;
      },
      GidTypeSelect(val) {
        this.$emit('getGoodsSkuConfigByGid', val[val.length - 1])
      }
    },
    mounted() {
      this.timeVersion();
    }
  };

</script>


<style lang="scss">
  .tools {
    background-color: white;
    height: 60px;
    text-align: left;
    line-height: 60px;
    padding-left: 10px;
    .el-input {
      width: 200px;
      padding-top: 2px;
      height: 60px;
    }
    .el-button {}
    .el-button:hover {
      background: #e6f6fa;
      color: #003544;
      border-radius: 0px;
    }
  }

</style>
